<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>预约挂号</title>
</head>
<link rel="stylesheet" href="/static/layui/css/layui.css" media="all"/>
<link rel="stylesheet" href="/static/css/public.css" media="all" />
<link rel="stylesheet" href="/static/css/repair.css" media="all" />
<body class="childrenBody">
<form class="layui-form layui-row layui-col-space10">
    <div class="layui-col-md4 layui-col-md-offset4 layui-col-xs12">
        <div class="layui-row layui-col-space10">
            <div class="layui-col-md12 layui-col-xs7">
                <div class="layui-form-item magt3">
                    <label class="layui-form-label"><span class="required">*</span>患者姓名</label>
                    <div class="layui-input-block">
                        <input type="text" class="layui-input patName" AUTOCOMPLETE="off" name="patName" lay-verify="required" placeholder="请输入患者姓名">
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="layui-col-md4 layui-col-md-offset4 layui-col-xs12">
        <div class="layui-row layui-col-space10">
            <div class="layui-col-md12 layui-col-xs7">
                <div class="layui-form-item magt3">
                    <label class="layui-form-label"><span class="required"></span>选择医生</label>
                    <div class="layui-input-block">
                        <select id="doctorNo" name="doctorNo" lay-filter="doctorNo">

                        </select>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="layui-col-md4 layui-col-md-offset4 layui-col-xs12">
        <div class="layui-row layui-col-space10">
            <div class="layui-col-md12 layui-col-xs7">
                <div class="layui-form-item magt3">
                    <label class="layui-form-label"><span class="required"></span>选择科室</label>
                    <div class="layui-input-block">
                        <select id="departmentNo" name="departmentNo" lay-filter="departmentNo">

                        </select>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="layui-col-md4 layui-col-md-offset4 layui-col-xs12">
        <div class="layui-row layui-col-space10">
            <div class="layui-col-md12 layui-col-xs7">
                <div class="layui-form-item magt3">
                    <!--<label class="layui-form-label"><span class="required"></span>预约时间</label>-->
                            <label class="layui-form-label"><span class="required"></span>预约时间</label>
                            <div class="layui-input-block">
                                <input type="text" class="layui-input" AUTOCOMPLETE="off" name="date" id="date" placeholder=" - ">
                            </div>
                </div>
            </div>
        </div>
    </div>

    <div class="layui-col-md4 layui-col-md-offset4 layui-col-xs12">
        <div class="layui-row layui-col-space10">
            <div class="layui-col-md12 layui-col-xs7">
                <div class="layui-form-item magt3">
                    <div class="layui-input-block">
                        <a class="layui-btn layui-btn-sm" lay-filter="addRegistration" lay-submit><i class="layui-icon">&#xe605;</i>挂号</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</form>
</body>
<script type="text/javascript" src="/static/layui/layui.js"></script>
<script type="text/javascript">
    layui.use(['form','jquery','element','laydate'],function () {
        var form = layui.form,
            $ = layui.jquery,
            element = layui.element,
            laydate = layui.laydate

        laydate.render({
            elem:'#date'
            ,range: true
            ,theme: 'grid'
            ,btns: ['clear', 'confirm','now']
            ,position:'abolute'
            ,type: 'datetime'
            ,format: 'yyyy-MM-dd HH:mm'
        });



        /*查询所有医生*/
        $.ajax({
            url:'/doctor/listAllDoctor',
            type:'GET',
            success:function (res) {
                var options = "<option value=''>"+'请选择一名医生'+"</option>";
                $.each(res.data,function (index,item) {
                    options +=  "<option value='"+item.id+"'>"+item.docName+"</option>";
                });
                $("#doctorNo").append(options);
                form.render();
            }
        });



        /*查询所有医生*/
        $.ajax({
            url:'/department/listAllDept',
            type:'GET',
            success:function (res) {
                var options = "<option value=''>"+'请选择科室'+"</option>";
                $.each(res.data,function (index,item) {
                    options +=  "<option value='"+item.id+"'>"+item.depAddress+"</option>";
                });
                $("#departmentNo").append(options);
                form.render();
            }
        });


        /**
         * 添加医生
         */
        form.on('submit(addRegistration)',function (obj) {
            var index = top.layer.msg('数据提交中，请稍候',{icon: 16,time:false,shade:0.8});
            var data = obj.field;
            console.log(data);
            /**
             * 请求后台
             */
            $.ajax({
                type:'POST',
                url:'/registration/addRegistration',
                data:JSON.stringify(data),
                dataType:'json',
                contentType:'application/json',
                success:function (res) {
                    /**
                     * 添加成功后回调
                     **/
                    setTimeout(function(){
                        top.layer.close(index);
                        $('input[name=patName]').val('');
                        $('select[name=doctorNo]').val('');
                        $('select[name=departmentNo]').val('');
                        form.render();
                        top.layer.msg("挂号成功，请耐心等待！");
                    },500);
                    return false;
                }
            });
        })
    });
</script>
</html>